<template>
  <div class="app-container">
    <router-view v-slot="{ Component }">
      <keep-alive :include="['MyRecover']">
        <component :is="Component"/>
      </keep-alive>
    </router-view>
    <!-- <router-view></router-view> -->
    <div class="loading">
      <van-loading size="35px" text-size="18px" type="spinner" v-show="isLoading"
        >正在加载...</van-loading
      >
    </div>
  </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
  computed: {
    ...mapState(['isLoading'])
  }
}
</script>

<style lang="less" scoped>
.app-container {
  background-color: #f3f3f3;

  .loading {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}
</style>
